<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .box{width: 100px;height: 100px;background: red;position: absolute;left:300px;top:200px;}
    </style>
</head>
<body>
    <span></span>
    <div class="box"></div>
</body>
<script>
    // offsetX和Y的缺点

    var ospan = document.querySelector("span")

    document.onmousemove = function(eve){
        var e = eve || window.event;

        // console.log(1)

        // ospan.innerHTML = e.offsetX + ", " + e.offsetY;
        // ospan.innerHTML = e.clientX + ", " + e.clientY;
        ospan.innerHTML = e.pageX + ", " + e.pageY;
    }

</script>
</html>